"use strict";
import * as React from 'react';
import MyText from "./MyText";
import { autoSize, commonStyles } from "../assets/styles/common";
import MyIcon from "./icon";
import Colors from "../assets/styles/Colors";
import { orderItemStyles } from "../assets/styles/orderItem";
import { Actions } from "react-native-router-flux";
const { View, TouchableOpacity } = require('react-native');
const { connect } = require('react-redux');
class OrderItem extends React.Component {
    constructor() {
        super(...arguments);
        this.iconProps = {
            size: autoSize(15),
            color: Colors.Primary
        };
        this.textProps1 = {
            color: Colors.Black,
            fontSize: 16
        };
        this.textProps2 = {
            color: Colors.SubTitle,
            fontSize: 13,
            style: {
                marginTop: autoSize(10)
            }
        };
    }
    render() {
        const { name, phone, address, onPress, style } = this.props;
        if (onPress) {
            return (<TouchableOpacity style={[commonStyles.flexColumn, orderItemStyles.container, style]} onPress={onPress}>
                    <View style={[commonStyles.flexRow]}>
                        <View style={[commonStyles.flex1, commonStyles.flexRow, orderItemStyles.topContainer]}>
                            <MyText {...this.textProps1}>{name}</MyText>
                            <MyText {...this.textProps1} style={{ marginLeft: autoSize(15) }}>{phone}</MyText>
                        </View>
                        <View style={[commonStyles.flexRow]}>
                            <TouchableOpacity style={[orderItemStyles.icon, commonStyles.centerVH]} onPress={Actions.location}>
                                <MyIcon name='icon-dingwei' {...this.iconProps}/>
                            </TouchableOpacity>
                            <TouchableOpacity style={[orderItemStyles.icon, commonStyles.centerVH]}>
                                <MyIcon name='icon-dianhua' {...this.iconProps}/>
                            </TouchableOpacity>
                        </View>
                    </View>

                    <MyText {...this.textProps2}>{address}</MyText>
                </TouchableOpacity>);
        }
        else {
            return (<View style={[commonStyles.flexColumn, orderItemStyles.container, style]} activeOpacity={onPress ? 0 : 1}>
                    <View style={[commonStyles.flexRow]}>
                        <View style={[commonStyles.flex1, commonStyles.flexRow, orderItemStyles.topContainer]}>
                            <MyText {...this.textProps1}>{name}</MyText>
                            <MyText {...this.textProps1} style={{ marginLeft: autoSize(15) }}>{phone}</MyText>
                        </View>
                        <View style={[commonStyles.flexRow]}>
                            <TouchableOpacity style={[orderItemStyles.icon, commonStyles.centerVH]} onPress={Actions.location}>
                                <MyIcon name='icon-dingwei' {...this.iconProps}/>
                            </TouchableOpacity>
                            <TouchableOpacity style={[orderItemStyles.icon, commonStyles.centerVH]}>
                                <MyIcon name='icon-dianhua' {...this.iconProps}/>
                            </TouchableOpacity>
                        </View>
                    </View>

                    <MyText {...this.textProps2}>{address}</MyText>
                </View>);
        }
    }
}
OrderItem.defaultProps = {
    style: null,
    name: '新鲜之道店铺',
    phone: '186xxxxxxxx',
    address: '地址：湖北武汉市硚口区凯景国际大厦-古田二路凯景国际大厦',
    onPress: null,
};
export default OrderItem;
